<template>
  <view class="mypet">
    <view class="box1" @click="back">
      <uv-icon name="arrow-left" color="#fff"></uv-icon>
      <view class="box11">我的宠物</view>
    </view>
    <view class="mypet-box">
      <view class="mypet-item" v-for="(item,index) in pett" :key="index">
        <view class="mypet-item-image">
          <image :src="item.image" mode="scaleToFill" />
        </view>
        <view class="mypet-item-text">{{ item.name }}</view>
        <view class="mypet-item-t">
          <uv-input :placeholder="item.type" border="none">
            <template v-slot:suffix>
              <uv-icon name="edit-pen" size="30" @click="goinfor(item.id)"></uv-icon>
            </template>
          </uv-input>
        </view>
      </view>
    </view>
    <view class="mypet-but">
      <uv-button text="新增宠物" shape="circle" color="#008c8c" @click="goaddpet"></uv-button>
    </view>
  </view>
</template>

<script setup>
  import {
    ref
  } from 'vue';
  import {
    onLoad
  } from '@dcloudio/uni-app';
  import {
    uniRequest
  } from "../../utils/request.js"
  const pet = ref([{
      image: 'https://picsum.photos/200?11',
      name: '宠物名称'
    },
    {
      image: 'https://picsum.photos/200?12',
      name: '宠物名称'
    },
    {
      image: 'https://picsum.photos/200?13',
      name: '宠物名称'
    },
    {
      image: 'https://picsum.photos/200?14',
      name: '宠物名称'
    },
  ]);
  
  const pett = ref('')
  onLoad(() => {
    uniRequest('pet/index?server=1', function(err, data) {
      if (err) {
        // 错误
        console.log(err)
      } else {
        console.log('"成功了"', data)
        pett.value = data
        console.log(pett.value)
      }
    }, 'POST', {

    });
  })
  const goaddpet = () => {
    uni.navigateTo({
      url: '/pages/tianjiacw/tianjiacw'
    })
  }
  const goinfor = (id) => {
    uni.navigateTo({
      url: `/pages/chongwuxx/chongwuxx?id=${JSON.stringify(id)}`
    })
  }
  const back = (() => {
    uni.navigateBack({
      delta: 1, // 返回1个，如果是2，返回2个页面
    });
  })
</script>

<style lang="scss">
  @import url("wodechongw.scss");
</style>